$(function(){
	var mymusic = document.getElementById('mymusic'),
		eindex = 0,		//记录请求播放错误次数
		mmid = 0,       //准备播放的mid
		texts = [],     //文本内容
		timers = [],    //所有对应时间的数组
		mIndex = 0,     //歌曲在li中对应的索引
		pIndex = 0 ,    //当前播放歌曲在列表中的索引
		playList = [],   //播放列表中对应的id集合
		contents = [],   //每个时间对应的内容
		str = "",        //对应的所有歌词
		status = 0,      //播放顺序
		n = 0,           //播放到的位置
		/*设置播放规则的图片数组    排序规则 0 顺序播放 1 单曲循环 2 列表循环 3 随机播放*/
		imgs = ['../images/shunxu.png','../images/danqu.png','../images/xunhuan.png','../images/random.png'],
		titles = ['顺序播放','单曲循环','列表循环','随机播放'], //对应的提示
		mycolor = 'black', //正在播放的歌词的显示颜色
	    duration = 0;   //当前歌曲的持续时长
	
	function sendRequest(){
		$.get("../PageListen","opr=onload&page=music");
	};
	sendRequest();
	
	setTimeout(function(){
		localStorage.setItem('demo',new Date());	
	},2000);
	
	//setInterval(sendDatas,2000); //设置定时器去请求数据
	
	//通过本地存储的方式来请求对应的数据
	window.addEventListener('storage',function(e){
		sendDatas();
	},false);
	
	/*同时设置监听器动态请求会话中的播放列表信息*/
	function sendDatas(){
		$.getJSON('../PlayServlet',null,getResult);
	};
	
	/*响应有结果后的处理*/
	function getResult(data){
		console.log("data:"+data);
		playList = [];  //将playList的数据清空掉
		var num = 1;
		$(".music .head").show();
		$(".playList li:not(:first)").remove(); //返回为集合的时候动态加载对应的数据
		for(var key in data){
			console.log("key:"+key,"datas:"+data[key]);
			$(".playList").append('<li data-path='+data[key].mid+' id='+data[key].murl+'>'+
				   ' <input type="checkbox" class="chb" data-tag="false">'+
					'<div class="song" data-info='+data[key].mname+data[key].sname+'>'+data[key].mname+
					'</div> <span class="music">'+data[key].sname+'</span> <span class="time">04:00</span>'+
					'<div class="display" title='+data[key].purl+'><span class="display">'+data[key].lyric+'</span></div></li>');
			num++;
			playList.push(data[key].mid+''); //把所有歌曲放到mid中
		}
		if(num == 2){
			//加载完成之后,调用play方法开始播放最后一首歌,并动态改变歌词,参数为对应的li元素
			var $li = $(".playList li:last");
			play($li);
		}
	}
	
	function play(li){
		var $li = $(li);
		$(".mycon").html(loadContent($li.find('.display:last').html()));    //歌词更新
		$("#sim_song_info").html($li.children('.song').html()+$li.find('.music').html()); //歌手信息更新
		$("#time_show").html("00:00/"+$li.find('.time').html());     //时间更新
		$("#myimg").attr('src',$li.find('.display').attr('title'));  //图片替换
		mmid = $li.attr('data-path');		   //播放的mid
		mIndex = $(".playList li").index($li);  //此时在li中的索引
	    pIndex = $.inArray(mmid+'',playList);  //播放的索引
	    //记录此时播放的音乐信息
		musicInfo = $li.find('.song').attr('data-info');  
		console.log("请求的musicinfo:"+musicInfo);
		mymusic.src = $li.attr('id');  //播放歌曲
		mymusic.play();
	}
	
	/*文本改变以后动态的去加载divCon中的内容*/
    function loadContent(data){
		texts = data.split('[');  //将文件拆分后得到的部分
		timers = [];	//重新将数组清空掉
		contents = [];
		var str = "";
		for(var i =0;i<texts.length;i++){
            var timerstr = texts[i].split(']')[0];
            var contentst = texts[i].split(']')[1];
            if(contentst && contentst.trim()!=""){
                timers.push(timerstr.substring(0,5));
                contents.push(contentst);
            }
        }
        for(var i=0;i<timers.length;i++){
            str+="<p id='"+timers[i]+"'>"+contents[i]+"</p>";
        }
        return str;
    }
    
	/*设置播放进度*/
	$("#progress").click(function(e){
		var e = e || window.event,
			w = e.offsetX;
			width = document.getElementById('progress').clientWidth;
			$("#progress #bar").css('left',w+'px');
		var time = Math.floor(w/width*duration);
			mymusic.currentTime = time;  //int类型
		/*根据当前时间来判断应该显示到的时间位置 并设定好对应的格式*/
		for(var i =timers.length-1;i>0;i--){
			var thisTime = getTime(timers[i]);
			if(thisTime<=time){
				n = i-1;
				var $thisTime = $(document.getElementById(thisTime));
				$thisTime.css({"color":mycolor,"font-size":"19px"}).siblings().css({"color":"#fff","font-size":"16px"});
				$(".mycon").css("top",-n*30+"px"); //30px是行高
				break;
			}
		}	
	})
	
    //为音乐添加时间更新事件
    mymusic.addEventListener("timeupdate", function () {
        var time = parseInt(this.currentTime); //将当前事件转化成秒
        	timeId = getDura(time);
        if(document.getElementById(timeId)){  //如果这个id有存在
            var $thisTime = $(document.getElementById(timeId));
            $thisTime.css({"color":mycolor,"font-size":"19px"}).siblings().css({"color":"#fff","font-size":"16px"});
        }
        //让字体产生上移的效果
        if($(".lrc p").eq(n+7) && $(".lrc p").eq(n+7).attr("id") == timeId){
        	$(".mycon").css("top",-n*30+"px"); //30px是行高
            n++;
        }
        var width = document.getElementById('progress').clientWidth; //更新播放的滚动条
        $("#time_show").html(timeId+"/"+getDura(duration));   //更新播放的时间
		$("#progress .outer").animate({   		/*给外层部分边框增加动画效果*/
			"left":Math.floor(time/duration*width)+'px'
		},30);
    });
    
    //添加播放结束的事件
    mymusic.addEventListener("ended", function () {
    	console.log('此时播放结束:');
    	initial();
        orderPlay();
    });
    
    function initial(){
    	n = 0;
        $(".mycon").css("top","0px");
        $("#progress .outer").css('left','0px');
    }
    
   //根据顺序播放音乐
	function orderPlay(){
		switch(status){
			//顺序播放的时候 放到最后一首就放
			case 0:
				if(pIndex+1>=playList.length){return;}
				pIndex++;  //否则index+1 将路径设为对应的	
				$.getJSON("../MusicControl.html","mid="+playList[pIndex],sendData);
				break;   
			case 1:mymusic.play();break;	  //单曲循环的时候
			case 2:
				pIndex++;
				if(pIndex>=playList.length){pIndex=0;}
				$.getJSON("../MusicControl.html","mid="+playList[pIndex],sendData);
				break;   
			case 3:
				var num = Math.floor(Math.random(playList.length));
				pIndex = num;   //当前播放歌曲的索引
				$.getJSON("../MusicControl.html","mid="+playList[pIndex],sendData);
				break;   
		}
	}
	
	/*上一首,下一首*/
	$(".prev").click(function(){
		pIndex = Math.max(0,--pIndex);
		$.getJSON("../MusicControl.html","mid="+playList[pIndex],sendData);
	})
	
	$(".next").click(function(){
		pIndex = Math.min(playList.length-1,++pIndex);
		$.getJSON("../MusicControl.html","mid="+playList[pIndex],sendData);
	})
	
	/*拿到数据后的回调函数*/
	function sendData(data){
		mymusic.src = data.murl;
		mymusic.play();
		musicInfo =data.mname+""+data.sname ; //记录此时的要播放的音乐信息 用作搜索
		$("#sim_song_info").html(data.mname+"-"+data.sname);  //更改需要改的数据
		$("#myimg").attr('src',data.purl);
		$(".mycon").html(loadContent(data.lyric));
	}
	
	//如果请求有误,就重新发送一个ajax请求数据到后台服务器中去处理
	mymusic.addEventListener('error',function(){
		eindex++;
		if(eindex<=3){
			$.post("../AddMusic.html",musicInfo==""?"mname=mainkaunhoonm":"mname="+musicInfo,reload,"json");
		}else{  //如果请求3次都失败
			$("#musicname").html('<p class="loading">正在连接歌曲中<span>...</span></p>');
			setTimeout(function(){
				$.post("../AddMusic.html","mname=mainkaunhoonm",reload,"json");
			},3000);   //3秒后再请求其他歌曲
		}
	},false);
	
	/*请求成功后重新加载数据  这部分只确保了音乐的播放,并没有保证作者和歌词部分的一致*/
	function reload(data){
		for(var key in data){
			mymusic.src = data[key].murl;  /*拿到对应的路径开始播放*/
			mymusic.play();
			$(".playList li").eq(mIndex).attr('id',data[key].murl);
			var dl = data[key].murl.replace(new RegExp("&","g"),"abc123");
			$.get("../UpdateMusic","mid="+mmid+"&murl="+dl);
			break;
		}
	}
	
	$(".header").on('click','li',function(){
		var id = $(this).attr('id');
		if(id == 'collection'){   //收藏
			
		}else if(id == 'start'){  //开始播放
			/*找到选中的第一个非全选按钮的父元素li*/
			var $li = $(".playList").find('li .chb:not(:first):checked').first().parent();
			play($li);
		}else if(id == 'download'){  //下载
			var $li = $(".playList").find('li .chb:not(:first):checked').first().parent();
			var murl = $li.attr('id');
			download(murl);
		}else if(id == 'remove'){   //删除
			//所有选中的集合
			var $chbs = $(".playList").find('li .chb:not(:first):checked');
			for(var i = 0 ;i<$chbs.length;i++){
				var mid = $($chbs[i]).parent().attr('data-path');
				var murl = $($chbs[i]).parent().attr('id');
				playList.remove(mid);
				if(murl == mymusic.src){
					mymusic.pause();
				}
			}
			$(".playList").find('li .chb:not(:first):checked').parent().remove();
		}else if(id == 'clear'){   //清空
			$(".playList").children('li:not(:first)').remove();
			playList = [];
			pIndex= 0;
			mymusic.pause();
		}
	})
	
	/*数组扩展的删除*/
	Array.prototype.remove = function(val) {
        var index = this.indexOf(val);
        if (index > -1) {
            this.splice(index, 1);
        }
    };
	
    /*下载功能*/
	function download(murl){
		window.open(murl);
	}
	
	/*声音的开关*/
	$("#mute").click(function(){
		var src = $(this).children('img').attr('src');
		if(src.match('voiceon')){
			$(this).children('img').attr('src','../images/voiceoff.png');
			mymusic.volume = 0;
		}else if(src.match('voiceoff')){
			$(this).children('img').attr('src','../images/voiceon.png');
			setVolume();
		}
	})
	
	/*设置声音*/
	function setVolume(){
		var bLeft = $("#bgbars").css('left').replace('px','');
		    dwidth = $("#volume").width();
		    rate = ( bLeft/dwidth).toFixed(2); //取两位小数来设置声音
		    mymusic.volume = rate;
	}
	
	$("#volume").click(function(e){
		var e = e || window.event,
			w = e.offsetX;
		 	$("#bgbars").css('left',w+'px');
			setVolume();
	})
	
	$(".download").click(function(){
		var murl = mymusic.src;
		if(murl!=null){
			download(murl);
		}
	})
	
	/*切换播放和暂停*/
	$("#btnplay").click(function () {
        var src = $(this).children('img').attr('src');
		if(src.match('play')){
			mymusic.play();
        }else{
        	mymusic.pause();
        }
    });
	
	/*切换播放循环顺序*/
	$(".playorder").click(function(){
		status++;    //0 1 2 3 0...
		if(status==4){
			status = 0;
		}
		$(this).children('img').attr('src',imgs[status]);
	})
	
	//音乐播放成功时候需要做的事
	mymusic.addEventListener('play',function(){
		eindex = 0,      //将记录的请求次数重置为0
		initial();
		$("#btnplay").children('img').attr('src','../images/pause.png');
	});

	//音乐暂停需要做的事
	mymusic.addEventListener('pause',function(){
		$("#btnplay").children('img').attr('src','../images/play.png');
	});
	
	/*增加播放时长改变事件*/
	mymusic.addEventListener('durationchange',function(){
		duration = mymusic.duration;
	});

	/*全选*/
	$("#all").click(function(){
         if($(".chb:not(:first)").attr('data-tag').match('false')){
             $(".chb:not(:first)").attr('checked',true);
             $(".chb:not(:first)").attr('data-tag','true');
         }else{
             $(".chb:not(:first)").attr('checked',false);
             $(".chb:not(:first)").attr('data-tag','false');
         }
	})
	
	//格式化时间
	function getDura(duration){ 
		var minute = Math.floor(duration/60),    //获取分
		minute = minute <10?"0"+minute:minute,
				second = Math.floor(duration%60),    //获取秒
				second = second<10?"0"+second:second;
		return minute+":"+second;
	};
	
	//将格式化的时间返回为对应的整数
	function getTime(time){
		var minute = parseInt(time.split(":")[0]),
		    seconds = parseInt(time.split(":")[1]);
		return minute*60+seconds*1;
	}
})